<template>
	<view class="enterprise-msg">
		<titleName :name="name"></titleName>
		<view class="title-bgc"></view>
		<view class="content-wrap">
			<view class="enterprise-name">
				<view class="name">企业名称：</view>
				<view class="val">{{enterpriseDetail.customername}}</view>
			</view>
			<!-- 	<view class="enterprise-code">
				<view class="name">排污许可证号：</view>
				<view class="val">314159265368979323</view>
			</view> -->
			<view class="sewage">
				<view class="name">营业执照号：：</view>
				<view class="val">{{enterpriseDetail.dischargelicense}}</view>
			</view>
			<!-- <view class="business-entity">
				<view class="name">企业法人：</view>
				<view class="val">李东</view>
			</view> -->
			<view class="session">
				<view class="name">区域：</view>
				<view class="val">{{district}}</view>
			</view>
			<view class="local-environmenta">
				<view class="name">管辖地环保局：</view>
				<view class="val">{{departmentname}}</view>
			</view>
			<!-- <view class="longitude-latitude">
				<view class="name">经纬度：</view>
				<view class="val">河南省郑州市</view>
			</view> -->
			<view class="address">
				<view class="name">详细地址：</view>
				<view class="val">{{enterpriseDetail.customeraddress}}</view>
			</view>
			<view class="admin-one">
				<view class="name">环保管理员1：</view>
				<view class="val">{{enterpriseDetail.hbperson}}&nbsp;&nbsp;&nbsp; {{enterpriseDetail.hbmobile}}</view>
			</view>
			<view class="admin-two">
				<view class="name">环保管理员2：</view>
				<view class="val">
					{{enterpriseDetail.hbpersonsecond}}&nbsp;&nbsp;&nbsp;{{enterpriseDetail.hbmobilesecond}}
				</view>
			</view>
			<view class="enterprise-type">
				<view class="name">企业类型(以环评审批为准)：</view>
				<view class="val">{{enterpriseDetail.managementtype}}</view>
			</view>
		</view>
		<view class="business-license">
			<view class="name">资质证书图片</view>
			<view class="val">
				<view class="wrap" @click="searchImage(enterpriseDetail.dischargelicenseurl)">
					<image :style="computedlicenseStyle" :src="enterpriseDetail.dischargelicenseurl" mode=""></image>
				</view>
			</view>
		</view>
		<!-- <view class="business-license">
			<view class="name">授权委托书：</view>
			<view class="val">
				<view class="wrap" @click="searchImage(enterpriseDetail.authbookurl)">
					<image :style="computedAuthStyle" :src="enterpriseDetail.authbookurl" mode="">
					</image>
				</view>
			</view>
		</view> -->

	</view>
</template>
<!-- range.supportdepartmentid -->
<script setup>
	import titleName from '../../components/titleName.vue'
	import http from '../../request/index'
	import {
		ref,
		computed,
		reactive
	} from 'vue'
	let name = "企业信息"
	let enterpriseDetail = ref({})
	let district = ref('')

	let departmentname = ref('')
	let licenseStyle = reactive({})
	let authStyle = reactive({})
	let searchImage = (url) => {
		uni.previewImage({
			urls: [url],
			current: 0
		})
	}
	let computedlicenseStyle = computed(() => {

		return {
			width: licenseStyle.width,
			height: licenseStyle.height

		}

	})
	let computedAuthStyle = computed(() => {
		return {
			width: authStyle.width,
			height: authStyle.height

		}
	})

	let findId = function(data) {

		let id = enterpriseDetail.value.district
		let res = data.map((item) => {
			if (item.id == id) {

				district.value = item.regionname
				return
			}
			if (item.lstSubNodes && item.lstSubNodes.length > 0) {
				return findId(item.lstSubNodes)
			}
		})

	}

	http({
		url: '/enterprise/detail'
	}).then((res) => {
		if (res.code == 0) {
			enterpriseDetail.value = res.data

			uni.getImageInfo({
				src: enterpriseDetail.value.dischargelicenseurl,
				success: function(imageInfoRes) {

					const MAX_WIDTH = 600;
					const MAX_HEIGHT = 800;
					let ratio;

					if (imageInfoRes.width > imageInfoRes.height) {
						ratio = MAX_WIDTH / imageInfoRes.width
					} else {
						ratio = MAX_HEIGHT / imageInfoRes.height
					}

					const scale = Math.min(ratio, 1); // 确保不会超过原始尺寸
					const newWidth = imageInfoRes.width * scale;
					const newHeight = imageInfoRes.height * scale;


					licenseStyle.width = newWidth + 'rpx'
					licenseStyle.height = newHeight + 'rpx'


				}
			});



			uni.getImageInfo({
				src: enterpriseDetail.value.authbookurl,
				success: function(imageInfoRes) {

					const MAX_WIDTH = 600;
					const MAX_HEIGHT = 800;
					let ratio;

					if (imageInfoRes.width > imageInfoRes.height) {
						ratio = MAX_WIDTH / imageInfoRes.width
					} else {
						ratio = MAX_HEIGHT / imageInfoRes.height
					}

					const scale = Math.min(ratio, 1); // 确保不会超过原始尺寸
					const newWidth = imageInfoRes.width * scale;
					const newHeight = imageInfoRes.height * scale;
					authStyle.width = newWidth + 'rpx'
					authStyle.height = newHeight + 'rpx'



				}
			});



		}
	})

	http({
		url: '/region/datalisttree'
	}).then((res) => {
		let data = res.data
		findId(data)

	})

	http({
		url: '/listitem/getdepartment'
	}).then((res) => {
		if (res.code == 0) {
			let arr = res.data
			let result = arr.find((item) => {
				if (item.id == enterpriseDetail.value.supportdepartmentid) {
					departmentname.value = item.departmentname
					return item
				}

			})
			console.log(result, 'retuls');
		}

	})
</script>

<style lang="scss" scoped>
	.enterprise-msg {
		width: 100vw;
		height: 100vh;
		padding-top: 160rpx;

		.title-bgc {
			background: #0874FA;
			height: 160rpx;
			width: 100vw;
			position: fixed;
			top: 0%;
			left: 0;

		}

		.business-license,
		.sewage-discharge {
			// margin-top: 20rpx;
			padding-bottom: 20rpx;

			.name {

				font-size: 30rpx;
				color: #666666;
				line-height: 33rpx;
				padding-left: 48rpx;
				height: 85rpx;
				line-height: 85rpx;
			}

			.val {
				width: 100vw;
				padding: 0 30rpx 0 26rpx;
				margin-top: 10rpx;

				.wrap {
					min-height: 376rpx;
					background: #FFFFFF;
					border-radius: 14rpx;
					border: 1px dashed #BFBFBF;
					display: flex;
					justify-content: center;
					align-items: center;
					overflow: hidden;

					image {
						width: 304rpx;
						height: 255rpx;
					}
				}
			}
		}

		.sewage-discharge {
			margin-top: 20rpx;
			padding-bottom: 62rpx;

			.val {
				.wrap {
					image {
						width: 445rpx !important;
						height: 315rpx !important;
					}
				}
			}
		}

		.content-wrap {
			padding-top: 20rpx;

			view {
				display: flex;
				justify-content: space-between;
				height: 85rpx;
				padding: 48rpx 45rpx 45rpx 45rpx;
				align-items: center;

				.name {

					font-weight: 400;
					font-size: 31rpx;
					color: #666666;

					padding: 0;
				}

				.val {

					font-weight: 400;
					font-size: 33rpx;
					color: #333333;
					padding: 0;
				}
			}
		}
	}
</style>